<template>
  <section class="control">
    <p class="control-title">访问管控</p>
    <img class="img" src="@/assets/images/applyField/Frame-276-(2).png" lazy-load />
    <ul class="control-desc">
      <li>一般安保系统的局限性</li>
      <li>
        ·
        使用一般安保系统（ID/PWD、OTP、RFID、安保磁卡等）会导致的问题点
      </li>
      <li>· 会发生盗用他人ID/PWD的风险，且具有潜在性的安保问题</li>
      <li>
        ·
        使用可类推的PWD，存在被黑客入侵的风险（破译8位数的文本只需1分钟）
      </li>
      <li>
        ·
        OTP、RFID、安保磁卡等需要媒介辅助或需要携带，不够方便，且易丢失
      </li>
      <li>· 需要使用较复杂PWD，或需要定期更改</li>
    </ul>
    <div class="margin">
      <img class="img" src="@/assets/images/applyField/Frame-277-(1).png" lazy-load />
      <ul class="control-desc">
        <li>系统构建的目的</li>
        <li>· 通过虹膜识别实现物理安保（无媒介识别、生物密码）</li>
        <li>· 虹膜信息分散管理抵御黑客入侵，防止虹膜信息被二次利用</li>
        <li>
          ·
          打造出一个在进行数据库或系统访问时，安全性极高的安保访问控制系统
        </li>
      </ul>
    </div>
    <div class="table">
      <div class="table-row">
        <div></div>
        <div class="left">
          <p class="tableBottom bold padding">一般安保系统</p>
          <p>
            <span>密码</span>
            <span class="left">OTP</span>
          </p>
        </div>
        <div class="left">
          <p class="tableBottom bold padding">物理安全技术</p>
          <p>
            <span>指纹识别</span>
            <span class="left">虹膜识别</span>
          </p>
        </div>
      </div>
      <div class="table-row imgs">
        <div class="bold tableTop">识别资料</div>
        <div class="left tableTop">
          <img src="@/assets/images/applyField/image52.png" class="img1" />
        </div>
        <div class="left tableTop">
          <img src="@/assets/images/applyField/image53.png" class="img2" />
        </div>
        <div class="left tableTop">
          <img src="@/assets/images/applyField/image54.png" class="img3" />
        </div>
        <div class="left tableTop">
          <img src="@/assets/images/applyField/image55.png" class="img4" />
        </div>
      </div>
      <div class="table-row flex">
        <div class="bold tableTop">媒体</div>
        <div class="left tableTop">字、数字、符号组合</div>
        <div class="left tableTop">随机数字</div>
        <div class="left tableTop">指纹弧形纹</div>
        <div class="left tableTop">虹膜纹路</div>
      </div>
      <div class="table-row flex">
        <div class="bold tableTop">盗用可能性</div>
        <div class="left tableTop">高</div>
        <div class="left tableTop">低</div>
        <div class="left tableTop">可能</div>
        <div class="left tableTop">不可能</div>
      </div>
      <div class="table-row flex">
        <div class="bold tableTop">技术水平</div>
        <div class="left tableTop">低</div>
        <div class="left tableTop">通用技术</div>
        <div class="left tableTop">通用技术</div>
        <div class="left tableTop">优秀</div>
      </div>
      <div class="table-row flex">
        <div class="bold tableTop">维护费用</div>
        <div class="left tableTop">低</div>
        <div class="left tableTop">高</div>
        <div class="left tableTop">低</div>
        <div class="left tableTop">低</div>
      </div>
      <div class="table-row flex">
        <div class="bold tableTop">安保</div>
        <div class="left tableTop">存在盗用或潜在性的安保问题 （破译8位数的文本只需1分钟）</div>
        <div class="left tableTop">存在丢失的风险 每两年需要更换</div>
        <div class="left tableTop">存在伪造风险 误识别率高</div>
        <div class="left tableTop">物理安保中最佳的识别技术</div>
      </div>
      <div class="table-row flex">
        <div class="bold tableTop">对比</div>
        <div class="left tableTop">一般安保的局限性 需要定期更换 需要各种符号相组合</div>
        <div class="left tableTop">维护费用高昂 需要随时携带产品 相似时无法使用</div>
        <div class="left tableTop">通过接触进行活体识别 存在1：N方式的局限性</div>
        <div class="left tableTop">无媒介识别 最准确的本人身份验证技术</div>
      </div>
    </div>
    <p class="control-title">分析虹膜识别的相关案例</p>
    <ul class="control-list">
      <li>
        <p>美陆军</p>
        <img src="@/assets/images/applyField/image-56.png" lazy-load class="img" />
        <p>无人武器系统（遥控飞机、无人战斗车辆等） 使用虹膜作为操作员的身份验证</p>
      </li>
      <li>
        <p>NATO</p>
        <img src="@/assets/images/applyField/image-57.png" lazy-load class="img" />
        <p>监测战场情况的智能头盔用户识别（BAE系统）</p>
      </li>
      <li>
        <p>友利银行</p>
        <img src="@/assets/images/applyField/image-58.png" lazy-load class="img" />
        <p>构建友利银行数据库访问控制</p>
        <p>相关的生物（虹膜）识别系统</p>
      </li>
    </ul>
    <p class="control-title">数据库访问控制相关的虹膜识别分散管理系统（应用于00银行）-数据采集结构图</p>
    <img class="img" src="@/assets/images/applyField/Frame355.png" lazy-load />
  </section>
</template>

<script setup lang="ts">
</script>

<style lang="scss" scoped>
.control {
  margin-bottom: 80px;
  &-title {
    font-size: 44px;
    font-family: Source Han Sans CN, Source Han Sans CN-Bold;
    font-weight: 700;
    color: #2087e3;
    margin: 60px 0;
  }
  .margin {
    margin: 40px 0;
  }
  &-desc {
    padding: 40px 28px;
    background-color: #daeeff;
    font-size: 28px;
    color: #686868;
    line-height: 48px;
    border-radius: 0px 0px 16px 16px;
    li {
      &:first-child {
        font-size: 32px;
        font-family: Source Han Sans CN, Source Han Sans CN-Bold;
        font-weight: 700;
        color: #333333;
        line-height: 32px;
        margin-bottom: 20px;
      }
    }
  }
  .table {
    display: grid;
    border: 1px solid #c9c9c9;
    font-size: 24px;
    color: #686868;
    .bold {
      display: flex;
      justify-content: center;
      align-items: center;
      text-align: center;
      font-family: Source Han Sans CN;
      font-weight: 700;
      color: #333;
      font-size: 28px;
      padding: 0 20px;
    }
    .padding {
      padding: 26px 0;
    }
    &-row {
      display: flex;
      div {
        flex: 1;
        &:first-of-type {
          flex: none;
          width: 110px;
        }
        p {
          display: flex;
          justify-content: center;
          span {
            flex: 1;
            display: flex;
            justify-content: center;
            padding: 14px 0;
          }
        }
      }
    }
    .flex {
      div {
        display: flex;
        align-items: center;
        padding: 14px 10px;
        &:first-child {
          padding: 14px 20px;
        }
      }
    }
    .left {
      border-left: 1px solid #c9c9c9;
    }
    .tableBottom {
      border-bottom: 1px solid #c9c9c9;
    }
    .tableTop {
      display: flex;
      justify-content: center;
      border-top: 1px solid #c9c9c9;
    }
    .imgs {
      div {
        padding-top: 37px;
        padding-bottom: 37px;
      }
      .img1 {
        width: 128px;
        height: 68px;
      }
      .img2 {
        width: 123px;
        height: 71px;
      }
      .img3 {
        width: 75px;
        height: 92px;
      }
      .img4 {
        width: 118px;
        height: 82px;
      }
    }
  }
  &-list {
    li {
      margin-bottom: 60px;
      p {
        display: flex;
        justify-content: center;
        font-size: 28px;
        color: #686868;
        padding: 0 50px;
        &:first-child {
          font-size: 32px;
          color: #333;
          font-family: Source Han Sans CN, Source Han Sans CN-Bold;
          font-weight: 700;
        }
      }
      img {
        margin: 40px 0;
      }
    }
  }
}
</style>